import { mount } from '@vue/test-utils'
import Index from "../../src/dev/index.vue"
import InputConpoment from "../../src/dev/input.vue"
import PeddingConponent from "../components/pedding"
import Vue from "vue";
export let delay = function (time = 1800) {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve("1");
    }, time)
  });
}

/**
 * 
 * @param {*} value 
 * @param {*} options 
 * @description
 * * type {String} default mix
 * * overView {Boolean} default false
 * * noFocus {Boolean} default false 不触获取焦点
 * @param {*} tabIndex 
 * @returns 
 */
export let factorySlotFn = async function (value = 'abc', options = {}, tabIndex = 1) {
  let wrapperIndex;
  let wrapperInput;
  let inputDiv;
  let tab;
  let rootWrap = {
    template: `
    <div class="no-thingk-demo-wrap" style="position:relative;">
     
       
       <PeddingConponent/>
      <InputConpoment
       v-model="value"
       type="${options.type ? options.type : 'mix'}"
       :showFixedInput="${options.showFixedInput ? options.showFixedInput : false}"
       />
      <IndexComponent/>
    </div>
    `,
    components: {
      InputConpoment,
      "IndexComponent": Index,
      PeddingConponent
    }
  }
  let wrapper = mount(rootWrap, {
    data() {
      return {
        value: value
      }
    }
  });

  await wrapper.vm.$nextTick();
  //修改数据，默认展示第三个tab
  wrapperIndex = wrapper.findComponent(Index);
  //英文输入法
  wrapperInput = wrapper.findComponent(InputConpoment);

  async function focus() {
    inputDiv = wrapper.find('.vue-keyboard-input-text');
    //默认第二个是操作tab
    tab = wrapperIndex.findAll(".head-op-icon").at(tabIndex);
    await inputDiv.trigger('click');
    await tab.trigger("click");
  }
  if (!options.noFocus) {
    await focus();
  }



  return {
    wrapperIndex,
    wrapperInput,
    inputDiv,
    tab,
    wrapper,
    focus
  }
}

/**
 * 以下代码复制来之，饿了么
 */

let id = 0;

const createElm = function () {
  const elm = document.createElement('div');

  elm.id = 'app' + ++id;
  document.body.appendChild(elm);

  return elm;
};

/**
 * 回收 vm
 * @param  {Object} vm
 */
export const destroyVM = function (vm) {
  vm.$destroy && vm.$destroy();
  vm.$el &&
    vm.$el.parentNode &&
    vm.$el.parentNode.removeChild(vm.$el);
};

/**
 * 创建一个 Vue 的实例对象
 * @param  {Object|String}  Compo   组件配置，可直接传 template
 * @param  {Boolean=false} mounted 是否添加到 DOM 上
 * @return {Object} vm
 */
export const createVue = function (Compo, mounted = false) {
  if (Object.prototype.toString.call(Compo) === '[object String]') {
    Compo = { template: Compo };
  }
  return new Vue(Compo).$mount(mounted === false ? null : createElm());
};

/**
 * 触发一个事件
 * mouseenter, mouseleave, mouseover, keyup, change, click 等
 * @param  {Element} elm
 * @param  {String} name
 * @param  {*} opts
 */
export const triggerEvent = function (elm, name, ...opts) {
  let eventName;

  if (/^mouse|click/.test(name)) {
    eventName = 'MouseEvents';
  } else if (/^key/.test(name)) {
    eventName = 'KeyboardEvent';
  } else {
    eventName = 'HTMLEvents';
  }
  const evt = document.createEvent(eventName);

  evt.initEvent(name, ...opts);
  elm.dispatchEvent
    ? elm.dispatchEvent(evt)
    : elm.fireEvent('on' + name, evt);

  return elm;
};

/**
 * 触发 “mouseup” 和 “mousedown” 事件
 * @param {Element} elm
 * @param {*} opts
 */
export const triggerClick = function (elm, ...opts) {
  triggerEvent(elm, 'mousedown', ...opts);
  triggerEvent(elm, 'mouseup', ...opts);

  return elm;
};